<template>
</template>

<script>
export default {
        /*
        * 1. 给表单的属性判空
        * */
        name: "songs-form",
        props: {
            isEdit: {
                type: Boolean,
                default: false
            },
            step: {
                type: Number,
                default: 1
            },
            oldSong: {
                type: Object,
            }
        },
        data() {
            return {
                // songform: this.song,
                singers: [],
                valid: false,
                songform: {},
            }
        },
        methods: {
            //从上传组件中获取音频时长的方法
            getDuration(val) {
                this.songform.audioDuration = val
            }
        },
        watch: {
            //song是songs页面的，songform是form页面的
            //1.先点击新增，isEdit为false,打开表单，songform是空的，song也是空
            //2.改变表单的值，触发watch函数songform的值传到songs页面去赋值
            //3.再次点击新增，song的值未清空，songform也没清空
            songform: {
                deep : true,
                handler(){
                    this.$emit("changeSong",this.songform)
                }
            },
            "songform.categories": {
                deep:true,
                handler(){
                    this.$emit("changeSong",this.songform)
                }
            },
            "songform.singer": {
                deep:true,
                handler(){
                    this.$emit("changeSong",this.songform)
                }
            }

        },
        created() {

            //加载歌手的信息
            this.$http.get("/singer/page").then(resp=>{
                this.singers = resp.data.items
            })
        }
    };
</script>

<style scoped>
</style>
